<?php
/**
 * 跳转到此页面需要传来的参数包括(后面的值只是举例)：
 * 必要必要参数：
 *      $flagText = "11号足球公园（11人足球）";
 *      $findText = "city=china.chongqing courtType=soccer_court_7 eventId=1";
 *      $nowCity = "china.chongqing";
 *      $backPage = 'booking_list_by_day'
 * 可选参数：
 *      $eventId = '1';
 */
$cs = Yii::app()->getClientScript();
$cs->registerCSSFile(Yii::app()->request->baseUrl . '/css/mobile/booking_find_1.css');
$cs->registerCSSFile(Yii::app()->request->baseUrl . '/css/mobile/booking_list.css');
$screen = Blyn::app()->getUIManager()->getCurrentScreen();
$wxControl = $screen->getChildControl('BUIWXControl_1');
//get user
$user = Blyn::app()->getCurrentUser();
$url = $wxControl->getLinkUrl(array(
    'name' => '加入购物车',
    'id' => 'addToBookingCart_1'), array(
    'userId' => $user->getId()
        ));
$findTextArr = BWeSport::explodeFindtextToArray($findText);
$itemData = array(
    'city' => $findTextArr['city'],
    'courtType' => $findTextArr['courtType'],
    'bookingStatus' => 'available',
    'bookingStartTime' => '<=' . time(),
    'bookingEndTime' => '>=' . time(),
    'spaceId' => Blyn::app()->getActiveSpace()->getId()
);
if (isset($findTextArr['eventId'])) {
    $itemData['eventId'] = $findTextArr['eventId'];
}
$weekarray = array("周日", "周一", "周二", "周三", "周四", "周五", "周六");
$treeTable = new BTreeTable('BWInputValue');
/* To get all date for left menu.
 * the data like: $valueList=array('2014-12-01'=>8, '2014-12-02'=>4,...); */
$valueList = $treeTable->getValueList('startDate', array('itemData' => $itemData));
$availableDateList = $treeTable->getValueList('startDate', array('itemData' => $itemData));
$availableCourtList = $treeTable->getValueList('courtId', array('itemData' => $itemData));
$availableBookingView = $treeTable->getView(array('itemData' => $itemData),FALSE);

$bookableData = array();
$courtData = array();
foreach ($availableBookingView as $id => $bookable) {
    $startTime = $bookable->getItem('startTime')->getValue();
    $courtName = $bookable->getItem('courtName')->getValue();
    $courtId = $bookable->getItem('courtId')->getValue();
    $courtData[$courtId]=$courtName;
    $day = date('w', $startTime);
    $hour = date('H', $startTime);
    $bookableData[$day][$hour][$courtId] = $id;
}
?>
<meta name="viewport" content="initial-scale=1, width=device-width, maximum-scale=1, user-scalable=no">
<meta name="viewport" content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-touch-fullscreen" content="yes">
<meta name="full-screen" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="format-detection" content="telephone=no">
<link href="style/index.css" rel="stylesheet">
<body>
    <header class="navbar">
        <div class="nav-wrap-left">
            <?php if ($backPage == "booking_find_1") { ?>
                <a class="react back" href="<?php echo $wxControl->getLinkUrl(array('name' => '返回', 'id' => 'booking_find_1'), array('nowCity' => $nowCity)); ?>"><i class="text-icon icon-back"></i></a>
            <?php } else { ?>
                <a class="react back" href="<?php echo $wxControl->getLinkUrl(array('name' => '返回', 'id' => 'showAddBooking_1'), array('backPage' => $backPage, 'findText' => $findText, 'flagText' => $flagText, 'nowCity' => $nowCity)); ?>"><i class="text-icon icon-back"></i></a>
            <?php } ?>
        </div>
        <h1 class="nav-header"><?php echo '选择时间'; ?></h1>
        <?php $wxControl->renderView('booking_navigation', array()); ?>
    </header>
    <!--jiangfangxin's code start-->
    <style>
        body {}
        li {list-style: none;}
        em {display: inline-block;width: 36px; height: 15px;box-shadow: 1px 1px 2px #dedede;}
        #content {position: relative;}
        .table_style {width: 100%;max-width: 100%;margin-bottom: 20px;background-color: transparent;border-spacing: 0;border-collapse: collapse;}
        .table_style>thead>tr>th, .table_style>tbody>tr>th, .table_style>tfoot>tr>th, .table_style>thead>tr>td, .table_style>tbody>tr>td, .table_style>tfoot>tr>td {padding: 8px;line-height: 1.42857143;vertical-align: top;border-top: 1px solid #ddd;height: 20px;}
        #left {width: 100px;height: 100%;position: absolute;top: 0;left: 0;z-index: 500;background-color: white;overflow-y: auto;overflow-x: visible;color: #69B360;background-image: url(<?php echo Yii::app()->request->baseUrl . '/images/BWeSport/menu_bg.png'; ?>);background-repeat: repeat-y;}
        .choose_date {margin: 0;padding: 0;width: 90px;text-align: center;background-color: #F0EFED;border-right: 1px solid #ddd;}
        .choosed {background-color: rgb(250, 250, 250);}
        .choosed:before {content: "";width: 0;height: 0;display: inline-block;border-top: 10px solid transparent;border-left: 10px solid rgb(250, 250, 250);border-right: 0;border-bottom: 10px solid transparent;position: relative;top: 17px;left: 61px;z-index: 10000;}
        .choosed:after {content: "";width: 0;height: 0;display: inline-block;border-top: 10px solid transparent;border-left: 10px solid #ddd;border-right: 0;border-bottom: 10px solid transparent;position: relative;top: -8px;left: 20px;}
        #middle {margin: 0;padding: 0;width: 60px;text-align: center;position: absolute;top: 0;left: 100px;color: #69B360;background-color: white;}
        #middle tr th,#middle tr td {border: 0 !important;}
        #right {background-color: white;margin: 0px 0px 30px 160px;overflow-x: auto;}
        .time_col {margin: 0;padding: 0;width: 60px;text-align: center;float: left;}
        .time_col tr th,.time_col tr td {border: 0 !important;}
        .court_name {height: 36px;overflow: hidden;}
        /*.time_col tr td em {display: block;width: 36px; height: 15px;}*/
        .red em {background-color: #F56968;}
        .blue em {background-color: #D4F2EA;}
        .green em {background-color: #BBDE44;}
        #footer {width: 100%;position: fixed;left: 0;bottom: 0;z-index: 1000;border-top: 1px solid #ddd;background-color: white;box-shadow: 0px -2px 10px #dedede;}
        .arrow {width: 100%;height: 30px;text-align: center;}
        #footer table {margin: 0;padding: 0;width: 100%;text-align: center;}
        .footer_pannel tr td {padding: 3px 0;}
        .btn_box {width: 90%;padding: 0 20px;margin: o auto;}
        .fold {height: 30px;}
        .fold .footer_pannel {display: none;}
        .fold .arrow img {transform:rotate(0deg);-ms-transform:rotate(0deg);    /* IE 9 */-moz-transform:rotate(0deg);  /* Firefox */-webkit-transform:rotate(0deg); /* Safari 和 Chrome */-o-transform:rotate(0deg);    /* Opera */}
        .expand {height: 157px;}
        .expand .arrow img {transform:rotate(180deg);-ms-transform:rotate(180deg); 	/* IE 9 */-moz-transform:rotate(180deg); 	/* Firefox */-webkit-transform:rotate(180deg); /* Safari 和 Chrome */-o-transform:rotate(180deg); 	/* Opera */}
    </style>
    <script>
        var count = 0;  //选择场地的数量
        var unitPrice = <?php echo $minPrice; ?>;    //场地的单价
        var money = 0;  //总价
        $(document).ready(function() {
            $(".arrow").click(function() {
                if ($("#footer").hasClass("fold")) {
                    $("#footer").removeClass("fold");
                    $("#footer").addClass("expand");
                } else {
                    $("#footer").removeClass("expand");
                    $("#footer").addClass("fold");
                }
            });
            $(".choose_date tr td").click(function() {
                $(".choosed").removeClass("choosed");
                $(this).addClass("choosed");
                //Change the right content.
                var dateStr = $(this).attr("date");
                $("#right .day").css("display", "none");
                $("#right ." + dateStr).css("display", "inline-block");
            });
            $(".time_col tr td").click(function() {
                var className = $(this).attr("class");
                switch (className) {
                    case "red":
                        break;
                    case "blue":
                        $(this).attr("class", "green");
                        break;
                    case "green":
                        $(this).attr("class", "blue");
                        break;
                }
                count = $(".green").length;
                money = count * unitPrice;
                $(".count").html(count);
                $(".money").html("￥" + money);
            });
            $("#submit").click(function() {
                var len = $(".green").length;
                if (!len) {
                    alert("您还没有选择场地！");
                } else if (len > 10) {
                    alert("一次最多预订10个场地！");
                } else {
                    var bookingIds = "";
                    for (var i = 0; i < len; i++) {
                        var bookingId = $(".green").eq(i).attr("bookingId");
                        bookingIds += bookingIds ? " " + bookingId : bookingId;
                    }
                    //alert("bookingIds="+bookingIds);
                    $("#message-form input[name=bookingIds]").val(bookingIds);
                    $("#message-form").submit();
                }
            });
        });
    </script>

    <div id="content">
        <div id="left">
            <table class="choose_date table_style">
                <?php
                $i = 0;
                foreach ($valueList as $date => $count) {
                    $timestamp = strtotime($date . ' 00:00:00');
                    $week = $weekarray[date("w", $timestamp)];
                    $displayDate = date('n月j日', $timestamp);
                    if ($i == 0) {
                        echo '<tr><td date="' . $date . '" class="choosed">' . $week . '<br/>' . $displayDate . '</td></tr>';
                    } else {
                        echo '<tr><td date="' . $date . '">' . $week . '<br/>' . $displayDate . '</td></tr>';
                    }
                    $i++;
                }
                ?>
            </table>
        </div>
        <table id="middle" class="table_style">
            <tr><td><div class="court_name">&nbsp;</div></td></tr><tr><td>9-10</td></tr><tr><td>10-11</td></tr><tr><td>11-12</td></tr><tr><td>12-13</td></tr><tr><td>13-14</td></tr><tr><td>14-15</td></tr><tr><td>15-16</td></tr><tr><td>16-10</td></tr><tr><td>10-18</td></tr><tr><td>18-19</td></tr><tr><td>19-20</td></tr><tr><td>20-21</td></tr><tr><td>21-22</td></tr>
        </table>
        <div id="right">
            <?php
            $i = 0;
            foreach ($valueList as $date => $count) {
                $timestamp = strtotime($date . ' 00:00:00');
                $day = date("w", $timestamp);
                $displayDate = date('n月j日', $timestamp);
                if ($i == 0) {
                    echo '<table class="day ' . $date . '"><tr>';
                } else {
                    echo '<table class="day ' . $date . '" style="display:none;"><tr>';
                }
                foreach ($availableCourtList as $courtId => $count) {//courts as column
                    //$courtMessage = new BWMessage($courtId);
                    //$courtName = $courtMessage->getMediaManager()->getMedia('courtName')->content;
                    echo '<td><table class="time_col table_style">';
                    echo '<tr><th><div class="court_name">场地' . $courtData[$courtId] . '</div></th></tr>';
                    for ($j = 9; $j <= 21; $j++) {
                        $tmpTime = ($j >= 10 ? $j : '0' . $j) . '0000';
                        if (isset($bookableData[$day][$j][$courtId])) {
                            echo '<tr><td class="blue" bookingId="' . $bookableData[$day][$j][$courtId] . '" time="' . $timestamp . '"><em></em></td></tr>';
                        } else {
                            echo '<tr><td class="red" time="' . $tmpTime . '"><em></em></td></tr>';
                        }
                    }
                    echo '</table></td>';
                }

                /* Below red all courtId in a array.
                 * return array like: $valueList=array('1' => 1, '2' => 1,...); */
                /*
                  $valueList1 = $treeTable->getValueList('courtId', array('itemData' => array_merge($itemData, array('startDate' => $date))));
                  foreach ($valueList1 as $courtId => $count) {
                  echo '<td><table class="time_col table_style">';
                  echo '<tr><th><div class="court_name">场地' . $courtId . '</div></th></tr>';
                  //Generate findText to search.
                  $itemDataText = '';
                  $newItemData = array_merge($itemData, array('startDate' => $date, 'courtId' => $courtId));
                  foreach ($newItemData as $key => $value) {
                  $firstChar = substr($value, 0, 1);
                  if ($firstChar == '=' || $firstChar == '>' || $firstChar == '<') {
                  $itemDataText = ($itemDataText ? $itemDataText . " " . $key . $value : $key . $value);
                  } else {
                  $itemDataText = ($itemDataText ? $itemDataText . " " . $key . "=" . $value : $key . "=" . $value);
                  }
                  }
                 * 
                 */
                /* Below red all bookings match the conditions.
                 * return array like: $availableList=array('378' => BTreeList, '379' => BTreeList,...); */
                /*
                  $availableList = Blyn::app()->getActiveApp()->findByFindText($itemDataText);
                  $valueList2 = array();
                  foreach ($availableList as $bookingItem) {
                  $startOfTimeSlot = $bookingItem->getItem('startOfTimeSlot')->value;
                  $bookingId = $bookingItem->getId();
                  $valueList2[$startOfTimeSlot] = $bookingId;
                  }
                  //Loop output 9:00~22:00 bookings
                  for ($j = 9; $j <= 21; $j++) {
                  $tmpTime = ($j >= 10 ? $j : '0' . $j) . '0000';
                  if (isset($valueList2[$tmpTime])) {
                  echo '<tr><td class="blue" bookingId="' . $valueList2[$tmpTime] . '" time="' . $tmpTime . '"><em></em></td></tr>';
                  } else {
                  echo '<tr><td class="red" time="' . $tmpTime . '"><em></em></td></tr>';
                  }
                  }
                  echo '</table></td>';
                  }
                 * 
                 */
                echo '</tr></table>';
                $i++;
            }
            ?>
        </div>
    </div>
    <div id="footer" class="fold">
        <div class="arrow"><img src="<?php echo Yii::app()->request->baseUrl . '/images/BWeSport/up.png'; ?>"/></div>
        <table class="footer_pannel">
            <tr>
                <td>已售 <em style="background-color: #F56968;"></em></td>
                <td>可预订 <em style="background-color: #D4F2EA;"></em></td>
                <td>我的预订 <em style="background-color: #BBDE44;"></em></td>
            </tr>
            <tr>
                <td colspan="3"><?php echo $minPriceName; ?>:<font style="color: #69B360;font-size: 20px;">￥<script>document.write(unitPrice);</script></font></td>
            </tr>
            <tr>

                <td colspan="3"><table><tr><td>已选：<font class="count" style="color: #69B360;">
                                <script>count = $(".green").length;
                                    document.write(count);</script></font>个</td>
                            <td>总计：<font class="money" style="color: #69B360;font-size: 20px;">￥<script>document.write(count * unitPrice);</script></font></td></tr></table></td>
            </tr>
            <tr>
                <td colspan="3"><div class="btn_box"><button id="submit" class="btn btn-primary btn-block">提交订单</button></div></td>
            </tr>
        </table>
        <br/>
    </div>
    <!--jiangfangxin's code start-->
    <div id="ajax-loaderdiv" style="position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 35000;background-color: rgba(0, 0, 0, 0.3);display: none;">
        <img src="/billyn-dev/images/ajax-loader.gif" class="ajax-loader"style="position: absolute;left: 50%;top: 50%;margin-left: -16px;margin-top: -16px;display: block;"/>
    </div>
    <form action="<?php echo $url; ?>" id="message-form" method="post" style="display: none;">
        <input type="text" name="bookingIds" value=""/>
    </form>
</body></html>